<template>
  <!-- 不需要根标签 -->
  <h1 class="title">App...</h1>
  <!-- 
    vue2
      给组件绑定的事件默认都是自定义事件，需要通过$emit触发
      除非加上.native，才会绑定原生DOM事件（给组件最外层元素绑定DOM事件）
    vue3
      给组件绑定的事件默认都是原生DOM事件(注意：组件必须有根标签，它会给根标签绑定DOM事件)
      除非子组件声明接受事件（emits），才会是自定义事件（需要通过$emit触发）
   -->
  <Child @click="say"/>
</template>

<script lang="ts">
import Child from "./components/Child.vue";

export default {
  name: "App",
  components: {
    Child,
  },
  methods: {
    say() {
      console.log("hello");
    },
  },
};
</script>

<style>
.title {
  color: red;
}
</style>
